<!doctype html>
<html  class="x-admin-sm">
<head>
    <meta charset="UTF-8">
    <title>后台登录-X-admin2.2</title>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="stylesheet" href="/static/xadmin/css/font.css">
    <link rel="stylesheet" href="/static/xadmin/css/login.css">
    <link rel="stylesheet" href="/static/xadmin/css/xadmin.css">
</head>
<body class="login-bg">

<div class="login layui-anim layui-anim-up">
    <div class="message">x-admin2.0-管理登录</div>
    <div id="darkbannerwrap"></div>

    <div class="layui-form" >
        <input name="username" id="username" placeholder="用户名"  type="text" lay-verify="required" class="layui-input" >
        <hr class="hr15">
        <input name="password" id="password" lay-verify="required" placeholder="密码"  type="password" class="layui-input">
        <hr class="hr15">
        <div id="slideTest1" class="demo-slider"></div>
        <hr class="hr15">
        <span>
                请将滑块拖动至<span style="color:red;font-size:20px" id="ran"></span>之间
            </span>
        <hr class="hr15">
        <button id="btn" lay-filter="" onclick="" class="layui-btn layui-btn-disabled" style="width: 100%;height: 40px;font-size: 20px;color: #000000;font-family: '微软雅黑';">
            登录
        </button>
        <hr class="hr20" >

    </div>
</div>
<script type="text/javascript" src="/static/xadmin/jquery/jquery-3.2.1.min.js"></script>
<script src="/static/xadmin/lib/layui/layui.js" charset="utf-8"></script>
<script>
    layui.config({
        base: '/static/xadmin/' //静态资源所在路径
    });
    var r =0;
    //生成随机数函数
    function ran(){
        r = parseInt(Math.random()*100+1);
//			console.log(r);
        var rx =r-5;
        var ra=r+5;
        $('#ran').html(rx+'~'+ra);
    }
    ran();
    layui.use(['form', 'layer', 'jquery','slider'], function() {
        // 操作对象
        var form = layui.form,
            slider = layui.slider;
        var $ = layui.jquery;

        //滑动条
        slider.render({
            elem: '#slideTest1',
            change:function(value){
//				    console.log(value) //得到开始值
                var v = value;
                var ran = r;
                var startr = ran - 5;
                var  end = ran+5;
                console.log(startr,end)
                if(v>=startr&&v<=end){
//				    	console.log('12')
//                    $('#btn').css("background",'#189f92');
                    $('#btn').attr("class",'layui-btn')
                    $('#btn').attr("onclick",'login()');
                }else{
//                    $('#btn').css("background",'#c8c8c8');
                    $('#btn').attr("class",'layui-btn layui-btn-disabled')
                    $('#btn').attr("onclick",'');
                }
            }
        });
    });

function login() {
    var username=$("#username").val();
    var password=$("#password").val();
    $.post("{:url('/admin/login/login')}",{'name':username,'pwd':password},function(data){
        if(data.code==1){
            layer.msg(data.msg);
            window.location.href=data.url;
        }else{
            layer.msg(data.msg);
        }
    });
    return false;
}

</script>
<!-- 底部结束 -->
</body>
</html>